import React, { Component } from 'react';
import Taro from '@tarojs/taro';
import { View, Image, Text } from '@tarojs/components';
import baseNav from "../../layout/baseNav";
import { AtTabs, AtTabsPane } from 'taro-ui';

import './index.scss'

@baseNav(1)
export default class Index extends Component {
  constructor() {
    super();
    this.state = {
      userInfo: {
        nickName: '路人甲',
        avatar: 'https://yuyublog.oss-cn-shanghai.aliyuncs.com/head/head6.jpg'
      }
    }
    this.static = {
      tabList: [
        { label: '我发布的行程', path: '/pages/person-mine/index' }
      ]
    }
  }

  componentWillMount () {
    Taro.getUserInfo({
      fail(result) {
        Taro.showToast({ title: '没有找到您的昵称呢' })
      },
      success: (result) => {
        console.log(result, 'res')
        this.setState({
          userInfo: {
            nickName: result.nickName,
            avatar: result.avatar
          }
        })
      }
    })
  }
  componentDidMount () { }
  componentWillUnmount () { }
  componentDidShow () { }
  componentDidHide () { }

  handleClick(item) {
    if (!item.path) return;
    Taro.navigateTo({ url: item.path })
  }

  render () {
    const { userInfo } = this.state;
    const { tabList } = this.static;
    return (
      <View className="person">
        <View className="banner">
          <Image className="logo" src={userInfo.avatar}></Image>
          <View className="nickname">{userInfo.nickName}</View>
        </View>
        <View className="content">
          {
            tabList.map(item => <View className="item" onClick={this.handleClick.bind(this, item)}>{item.label}</View>)
          }
        </View>
      </View>
    )
  }
}
